import react from "react";
import "./header.css"

class Header extends react.Component{

    handleKeyUp = (event)=>{
        const {keyCode, target} = event;
        if(keyCode !== 13) return;
        if(target.value == null || target.value === "") return;
        const todoObj = {
            id: `${Date.now()}-${Math.floor(Math.random() * 1000)}`,
            name: target.value,
            done: false
        }
        this.props.addTodo(todoObj);
        target.value = '';
    }

    render(){
        return (
            <input type="text" className="header" placeholder="请输入你的任务，按回车键确认" onKeyUp={this.handleKeyUp}></input>
        )
    }
}

export default Header;